<form method="POST" action="index.php?ctl=member/memberattr&act=addMemAttr" class="tableform">

<div class="division"><table width="100%" border="0" cellpadding="0" cellspacing="0" id='attr_table'>        
    <tr>
    <th><{t}>注册项名称:<{/t}></th>
    <td><{input type="text" name="attr_name" required="true"}><em>*</em></td>
  </tr>
  <tr>
    <th><{t}>是否必填:<{/t}></th>
    <td><input type="checkbox" name="attr_required" value="true" id='srequired'/></td>
  </tr>
  <tr>
    <th><{t}>类型:<{/t}></th>
    <td><select name='attr_tyname' id="attr_tyname">
    <optgroup label="输入项">
    <option value="输入内容不限制"><{t}>&nbsp;&nbsp;输入内容不限制<{/t}></option>
    <option value="仅限输入数字"><{t}>&nbsp;&nbsp;仅限输入数字<{/t}></option>
    <option value="仅限输入字符"><{t}>&nbsp;&nbsp;仅限输入字符<{/t}></option>
    <option value="仅限输入数字和字符"><{t}>&nbsp;&nbsp;仅限输入数字和字符<{/t}></option>
    </optgroup>
    <optgroup label="选择项">
    <option value="单选项"><{t}>&nbsp;&nbsp;单选项<{/t}></option>
    <option value="多选项"><{t}>&nbsp;&nbsp;多选项<{/t}></option>
    </optgroup>
     <optgroup label="时间项">
    <option value="日期(年月日)"><{t}>&nbsp;&nbsp;日期(年月日)<{/t}></option>
    </optgroup>
     <optgroup label="即时通讯项">
    <option value="QQ">&nbsp;&nbsp;QQ</option>
    <option value="MSN">&nbsp;&nbsp;MSN</option>
    <option value="旺旺"><{t}>&nbsp;&nbsp;旺旺<{/t}></option>
    <option value="Skype">&nbsp;&nbsp;Skype</option>
    </optgroup>
    
    
    
    
    
    
    
    
    
    
    </select></td>
  </tr>


    </table></div>
  


<div class="table-action">
	<{button label="保存" type="submit"}>
	<{button label="取消" href="index.php?ctl=member/memberattr&act=index"}>
</div>

</form>


<script>
var dotest = function(){
var nRow=$('attr_table').rows.length;
var attr_tvalue=$('attr_tyname').getValue();
if((attr_tvalue=='单选项'&&nRow==3)||(attr_tvalue=='多选项'&&nRow==3)){
var nRow2=$('attr_table').rows.length;
var objTheRow2=$('attr_table').insertRow(nRow2);
var obj3 = $(objTheRow2).adopt([new Element('th'),new Element('td')]);
var otr2=objTheRow2.getElements('*').filter(function(i){return i.getTag()=='th'||i.getTag()=='td';});
 otr2[0].setText('后台可搜索:');
 otr2[1].setHTML("<input type='checkbox' name='attr_search' value='true'/>");

var nRow4=$('attr_table').rows.length;
var objTheRow=$('attr_table').insertRow(nRow4);
var obj1 = $(objTheRow).adopt([new Element('th'),new Element('td')]);
var otr=objTheRow.getElements('*').filter(function(i){return i.getTag()=='th'||i.getTag()=='td';});
 otr[0].setText('选项内容:');
 otr[1].setHTML('<input type="text" name="attr_option[]" class="_x_ipt"  required="true"><span onclick="deleteAtoRow($(this))" style="cursor:pointer"><{img title="删除" alt="删除" style="cursor: pointer;" src="images/bundle/delecate.gif"}></span>');
var nRow1=$('attr_table').rows.length;
var objTheRow1=$('attr_table').insertRow(nRow1);
var obj2 = $(objTheRow1).adopt([new Element('th'),new Element('td')]);
var otr1=objTheRow1.getElements('*').filter(function(i){return i.getTag()=='th'||i.getTag()=='td';});
 otr1[0].setText('');
 otr1[1].setHTML("<input type='button' style='cursor:pointer'title='增大选项' onclick='toadd();' class='button-add'/>&nbsp;<input type='button'  onclick='todel();' style='cursor:pointer'title='删除选项' class='button-cut'/>");

 
}else{
 //alert($('attr_table').rows.length);
if(($('attr_table').rows.length!=3&&attr_tvalue!='单选项')&&($('attr_table').rows.length!=3&&attr_tvalue!='多选项')){
for(var i=3;i<=$('attr_table').rows.length+1;i++){
$('attr_table').deleteRow(3);
}

}




}

};




function toadd(){

var nRow2=$('attr_table').rows.length;
var objTheRow2=$('attr_table').insertRow(nRow2-1);
var obj3 = $(objTheRow2).adopt([new Element('th'),new Element('td')]);
var otr2=objTheRow2.getElements('*').filter(function(i){return i.getTag()=='th'||i.getTag()=='td';});
 otr2[0].setText('');
 otr2[1].setHTML('<input type="text" name="attr_option[]" class="_x_ipt"  required="true"><span onclick="deleteAtoRow($(this))" style="cursor:pointer"><{img title="删除" alt="删除" style="cursor: pointer;" src="images/bundle/delecate.gif"}></span>');


}

function deleteAtoRow(el){
  if($ES('tr','attr_table').length<=6){
    alert('至少有一个选项');
    return;
  }
  if($ES('tr','attr_table')[5].getElement('th').getText()==''){
    $ES('tr','attr_table')[5].getElement('th').setText('选项内容:');
  }
  $(el).getParent('tr').remove();

}

function todel(){
    var nRow2=$('attr_table').rows.length;
    if(nRow2!=6){
    $('attr_table').deleteRow(nRow2-2);
    }else{
    alert('至少要有一个选项');
    }
}



window.addEvent('domready',function(){
   $('attr_tyname').addEvent('change',dotest);
});





</script>